Ext.define('AppStreet.view.viewport.MainViewport', {
    extend: 'Ext.container.Viewport',
    id: 'mainViewport',
    layout: {
        type: 'border'
    },
    
    showMessageBox: function(message){
        var messageWin;
        if(!messageWin){
            messageWin = Ext.create('widget.window',{
                title: 'Messages',
                width: '30%',
                autoHeight: true,
                html: message
            })
            messageWin.x = Ext.getCmp('mainViewport').getWidth()-(Ext.getCmp('mainViewport').getWidth()/3);
            messageWin.y = 60;
            
            messageWin.show(this, function(){
                
            });
        }
    },
    
    getViewportHeight: function(){
        var viewportHeight = Ext.getCmp('mainViewport').getHeight();
        return viewportHeight;
    },
    
    getViewportWidth: function(){
        var viewportWidth = Ext.getCmp('mainViewport').getWidth();
        return viewportWidth;
    },
    
    
    createWindow: function(extComponent, title, height, width){
        extComponent.region = 'center';
        var win;
        if(!win){
            win = Ext.create('widget.window',{
                title: title,
                layout: 'border',
                closeAction: 'destroy',
                items:[extComponent],
                autoHeight: true,
                width: width,
                modal: true,
                minimizable: true,
                maximizable: true,
                closable:true,
                collapsible:true,
                animCollapse: true,
                //maximized: true,
                listeners: {
                    maximize: function(){
                        var viewportHeight = Ext.getCmp('mainViewport').height;
                        //Ext.Msg.alert('Message',viewportHeight);
                        win.setHeight(viewportHeight);
                        win.doLayout();
                    }
                }
            })
            win.show(this, function(){

            });
        }
    },
    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'panel',
                    height: 150,
                    id: 'topPanel',
                    title: '',
                    collapseMode: 'header',
                    region: 'north',
                    split: true,
                    items: [
                        {
                            xtype: 'tabpanel',
                            id: 'searchTabPanel',
                            activeTab: 0,
                            items: [
                                {
                                    xtype: 'panel',
                                    id: 'searchTab',
                                    title: 'Search'
                                },
                                {
                                    xtype: 'panel',
                                    id: 'advanceSearchTab',
                                    title: 'Advance Search'
                                }
                            ]
                        }
                    ],
                    dockedItems: [
                                    {
                                        xtype: 'toolbar',
                                        id: 'loginToolBar',
                                        dock: 'top',
                                        layout: {
                                            pack: 'start',
                                            type: 'hbox'
                                        },
                                        items: [
                                            {
                                                xtype: 'button',
                                                text: 'Post Requirement',
                                                handler: function(){
                                                    //Ext.Msg.alert('Message','Requirement Form Underconstruction');
                                                    me.showMessageBox('Hello');
                                                }
                                            },
                                            {
                                                xtype: 'tbfill',
                                                anchor: '100%'
                                            },
                                            {
                                                xtype: 'button',
                                                text: 'Signup To Upload',
                                                handler: function(){
                                                    var companyBasicInfo = Ext.create("AppStreet.view.company.CompanyBasicInfo",{
                                                    });
                                                    me.createWindow(companyBasicInfo, 'Company Information', '35%', '50%');
                                                }
                                            },
                                            '-',
                                            {
                                                xtype: 'button',
                                                text: 'Login',
                                                handler: function(){
                                                    var loginForm = Ext.create("AppStreet.view.login.LoginForm",{
                                                    });
                                                    me.createWindow(loginForm, 'Login', '35%', '35%');
                                                }
                                            }
                                        ]
                                    }
                    ]
                },
                {
                    xtype: 'panel',
                    title: 'Applications Demo',
                    region: 'center',
                    items: [
                    ]
                    
                },
                {
                    xtype: 'panel',
                    width: 150,
                    collapseDirection: 'left',
                    collapsible: true,
                    headerPosition: 'left',
                    title: 'Promotion',
                    titleCollapse: true,
                    collapseMode: 'header',
                    region: 'east',
                    split: true
                },
                {
                    xtype: 'panel',
                    height: 100,
                    collapseDirection: 'bottom',
                    collapsible: true,
                    title: 'Messages',
                    titleCollapse: true,
                    collapseMode: 'header',
                    region: 'south',
                    split: true
                }
            ]
        });

        me.callParent(arguments);
    }
});